<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<div class="page-header">
    <h1>Money report</h1>
</div>
<h2>Chart of investing</h2>
<canvas id="moneyChart" width="700" height="400"></canvas>
<h2>Successfully finished projects</h2>
<table class="table table-striped table-hover">
    <thead>
    <tr>
        <td>Id</td>
        <td>Name</td>
        <td>Author</td>
        <td>Requested money</td>
        <td>Recieved money</td>
    </tr>
    </thead>
    <tbody>
    <c:forEach items="${finishedList}" var="grant">
        <tr>
            <td>${grant.grantId}</td>
            <td><a href="<c:url value="/grant/view/${grant.grantId}"/>">${grant.grantName}</a></td>
            <td><a href="<c:url value="/profile/${grant.user.userId}"/>">${grant.user.userLogin}</a></td>
            <td><fmt:formatNumber type="currency" currencySymbol="$" maxFractionDigits="0" groupingUsed="true" value="${grant.requestedMoney}"/> </td>
            <td><fmt:formatNumber type="currency" currencySymbol="$" maxFractionDigits="0" groupingUsed="true" value="${grant.moneyAmount}"/> (${grant.completedPercent}%)</td>
        </tr>
    </c:forEach>
    </tbody>
</table>
<script>

    var data = {
        labels: [
            <c:forEach items="${moneyTrasferGrData}" var="t">"<fmt:formatDate value="${t.date}" type="date" dateStyle="SHORT"/>" , </c:forEach>
        ],
        datasets: [
            {
                label: "My First dataset",
                fillColor: "rgba(220,220,220,0.2)",
                strokeColor: "rgba(220,220,220,1)",
                pointColor: "rgba(220,220,220,1)",
                pointStrokeColor: "#fff",
                pointHighlightFill: "#fff",
                pointHighlightStroke: "rgba(220,220,220,1)",
                data: [<c:forEach items="${moneyTrasferGrData}" var="t">"${t.value}", </c:forEach>]

            }
        ]
    };
    var ctx = document.getElementById("moneyChart").getContext("2d");
    new Chart(ctx).Line(data, {
    });
</script>